<template>
  <!--項目藥品信息-->
  <el-row>
    <el-col :span="22" :offset="1">

      <!--卡片shart-->
      <el-card class="box-card" style="padding: 0 15px;">

        <el-button type="primary" @click="insertproset" icon="el-icon-circle-plus" style="margin-left:60%">新增药品
        </el-button>
        <hr>
        <div class="right-items" style="float: left;">
          <el-select v-model="value" style="width: 30%" placeholder="全部">
            <el-option
              v-for="item in options"
              :key="item.cstatus"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
          <el-input
            size="medium"
            placeholder="全部"
            style="width: 50%"

            v-model="input1">
            <el-button slot="append" icon="el-icon-search">搜索</el-button>
          </el-input>
        </div>

        <el-table
          :data="tableData"
          border
          :header-cell-style="{background:'#C2C5F6',color:'#0a0a0d','text-align':'center',}"
          style="width: 100%;line-height: 23px"
          :cell-style="{'text-align':'center'}">
          <el-table-column
            prop="id"
            label="序号"
            width="50">
          </el-table-column>
          <el-table-column
            prop="cid"
            label="项目编号"
            width="50">
          </el-table-column>
          <el-table-column
            prop="cname"
            label="姓名"
            width="120">
          </el-table-column>
          <el-table-column
            prop="ccategories"
            label="项目类别"
            width="120">
          </el-table-column>
          <el-table-column
            prop="ctoll"
            label="收费"
            width="120">
          </el-table-column>
          <el-table-column
            prop="cretail"
            label="零售(元)"
            width="80">
          </el-table-column>
          <el-table-column
            prop="ccost"
            label="成本价(元)"
            width="80">
          </el-table-column>
          <el-table-column
            prop="cunits"
            label="单位"
            width="120">
          </el-table-column>
          <el-table-column
            prop="cstatus"
            label="状态"
            width="120">
          </el-table-column>
          <el-table-column
            prop="date"
            label="日期"
            width="130">
          </el-table-column>
          <el-table-column
            fixed="right"
            label="操作"
            width="100">
            <template slot-scope="scope">
              <el-button @click="handleClick(scope.row)" type="text" size="small">NO</el-button>
              <el-button type="text" @click="open1" class="el-icon-edit" size="small">编辑</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div class="block">

          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="currentPage4"
            :page-sizes="[10, 20, 30, 40]"
            :page-size="10"
            layout="total, sizes, prev, pager, next, jumper"
            :total="100">
          </el-pagination>
        </div>

        </el-card>
        <!--卡片end-->

      </el-col>
    </el-row>
</template>

<script>
  export default {
    methods: {
      handleClick(row) {
        console.log(row);
      },
      handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
      },
      handleCurrentChange(val) {
        console.log(`当前页: ${val}`);
      },
      insertproset: function () {
        this.$router.push("/prosetinsert")
      },
      open1: function () {
        this.$router.push("/prosetinsert")
      },

    },


    data() {
      return {
        options: [{
          value: 'cstatus',
          label: '启用'
        },
          {
            value: 'cstatus',
            label: '停用'
          }],
        value: 'cstatus',
        tableData: [{
          id: "1",
          cid: "1",
          cname: "阿莫西林",
          ccategories: "感冒",
          ctoll: "现金",
          cretail: "20",
          ccost: "10.2",
          cunits: "10",
          cstatus: "启用",
          date: "2016-05-04"

        }],
        currentPage4: 4,
        input1: '',

      }

    },

  }
</script>
